<template>
    <div class="page show-tabbar">
        <div class="searchbar">
            <div class="weui-search-bar" id="searchBar">
                <form class="weui-search-bar__form">
                    <div class="weui-search-bar__box">
                        <i class="weui-icon-search"></i>
                        <input type="search" class="weui-search-bar__input" id="searchInput" placeholder="搜索" required="">
                        <a href="javascript:" class="weui-icon-clear" id="searchClear"></a>
                    </div>
                    <label @click="toSearch" class="weui-search-bar__label" id="searchText" style="transform-origin: 0px 0px 0px; opacity: 1; transform: scale(1, 1);">
                        <i class="weui-icon-search"></i>
                        <span>搜索</span>
                    </label>
                </form>
                <a  class="weui-search-bar__cancel-btn" id="searchCancel">取消</a>
            </div>
        </div>
        <div class="mod-crumbs bg-color">{{groupName}}</div>
        <div class="list com-border-bottom" v-if="admins.add_member">
            <ul>
                <li class="com-border-bottom" @click="toAddMember">
                    <a class="touch" href="javascript:;">
                        <span class="bg_sprite icon icon_add_member"></span>
                        <div class="info">添加人员</div>
                    </a>
                </li>
                <li class="com-border-bottom" @click="toAddGroup">
                    <a class="touch" href="javascript:;">
                        <span class="bg_sprite icon icon_add_team"></span>
                        <div class="info">添加部门</div>
                    </a>
                </li>
            </ul>
        </div>
        <div class="list com-border-top com-border-bottom" v-if="teamListObj.sub_department.length">
            <ul>
                <template v-for="item in teamListObj.sub_department">
                    <li class="com-border-bottom" @click="gotoTeamGroupInfo(item.id,item.team_id,item.parent_id,item.name)">
                        <a class="touch" href="javascript:;">
                            <span class="bg_sprite icon icon_team"></span>
                            <div class="info">{{item.name}}</div>
                            <span class="arrow"></span>
                        </a>
                    </li>
                </template>
            </ul>
        </div>
        <!--成员列表-->
        <template v-if="teamListObj.department_user.length">
            <div class="list com-border-top com-border-bottom"> 
                <ul>
                    <li class="com-border-bottom" v-for="item in teamListObj.department_user">
                        <a class="touch" href="javascript:;" @click="gotoUserInfo(item.user_id,item.team_id,item.real_name,item.mobile,item.role_name,item.role)">
                            <template v-if="item.status == 1">
                                <img class="avatar" v-if="item.logo.thumb_url" :src="item.logo.thumb_url" alt="">
                                <img class="avatar" v-else src="http://sta.doumistatic.com/src/image/saas/avatar.png" alt=""> 
                                <div class="info" v-if="item.role == 5">
                                    <p class="title">{{item.real_name}}</p>
                                </div>
                                <div class="info" v-else>
                                    <p class="title"><span class="tag " :class="{tag_2:item.role == 8 , tag_1: (item.role == 1||item.role == 2)}">{{item.role_name}}</span>{{item.real_name}}</p>
                                </div>
                            </template>
                            <template v-if="item.status == 0">
                                <div class="avatar-box">
                                    <img class="avatar" v-if="item.logo.thumb_url" :src="item.logo.thumb_url" alt="">
                                    <img class="avatar" v-else src="http://sta.doumistatic.com/src/image/saas/avatar.png" alt=""> 
                                    <span class="cover">未激活</span>
                                </div>
                                <div class="info" v-if="item.role == 5">
                                    <p class="title">{{item.real_name}}</p>
                                </div>
                                 <div class="info" v-else>
                                    <p class="title">{{item.real_name}}<span class="tag " :class="{tag_2:item.role == 8 , tag_1: (item.role == 1||item.role == 2)}">{{item.role_name}}</span></p>
                                </div>
                            </template>
                        </a>
                    </li>
                </ul>
            </div>
        </template>
    </div>
</template>

<script>
    /**
     *  引入工具类库 或 Native API
     *  example : import widget from 'gapi/widget'
     */
     import $ from 'zepto'
     import * as util from 'js/util.js'
     import userCenterApi from 'clientApi/userCenterApi'
     import searchApi from 'clientApi/searchPage'
     import cache from 'gapi/cache'
     import GroupUtil from 'js/GroupUtil.js'
     import Member from 'js/Member.js'
     import commonPage from 'clientApi/commonPage.js'
     import socialApi from 'clientApi/socialApi'
     import widget from 'gapi/widget'
     import KCApiApp from 'clientApi/KCApiApp.js'
    /**
     *  引入组件 以及 组件接口(Action)
     *  example : import Somecomponents from 'components/Somecomponents/Somecomponents'
     */

    /**
     *  组件实例对象
     */
    export default {
        components: {

        },
        data: function(){
            return{
                admins:{
                    add_member:false,   // 是否有权添加人员和部门
                },
                webViewId:'',
                groupName:'',
                teamid:'',
                user_id:'',
                currRole:'',
                teamListObj:{
                    department_id:'',
                    sub_department:[],
                    department_user:[]
                }
            }
        },
        vuex: {
            getters: {

            },
            actions: {

            }
        },
        methods: {
            /**
             * 初始化
             * @method init
             * @public
             * @return {Null} void
             */
            init (){
                // 获取权限
                this.getPermissions()
                // 获取部门信息
                this.getData()
                window.loadData = (data) => {
                    console.log(data)
                    if(data && data.isadminsId == 99){
                        commonPage.loadPageStatus('loading')
                        util.ajax({
                            url:'/permission/application',
                            type:'GET',
                            data:{
                                team_id:this.teamid,
                                project_id:0,
                                application_id:0
                            },
                            timeout:10000,
                            success:(obj) => {
                                console.log(JSON.stringify(obj))
                                commonPage.loadPageStatus('loadSuccess')
                                if(obj&&obj.errno == 0){
                                    obj.data.forEach ( (i) => {
                                        if(i.id_name && i.id_name == 'admin_add_member'){ 
                                            this.admins.add_member = true;
                                        }else{
                                            this.admins.add_member = false;
                                        }
                                    })
                                }else{
                                    widget.toast(obj.errmsg)
                                }
                            },
                            error: (xhr, status) => {
                                commonPage.loadPageStatus('loadSuccess')
                                widget.toast('服务器异常')
                            },
                            noNetwork: () => {
                                commonPage.loadPageStatus('loadSuccess')
                                widget.toast('网络连接失败，请检查网络')
                            }
                        })
                    }
                    if(data && data.key == 'changeCurrRole'){
                        commonPage.loadPageStatus('loading')
                        util.ajax({
                            url:'/permission/application',
                            type:'GET',
                            data:{
                                team_id:this.teamid,
                                project_id:0,
                                application_id:0
                            },
                            timeout:10000,
                            success:(obj) => {
                                console.log(JSON.stringify(obj))
                                commonPage.loadPageStatus('loadSuccess')
                                if(obj&&obj.errno == 0){
                                    obj.data.forEach ( (i) => {
                                        if(i.id_name && i.id_name == 'admin_add_member'){ 
                                            this.admins.add_member = true;
                                        }else{
                                            this.admins.add_member = false;
                                        }
                                    })
                                }else{
                                    widget.toast(obj.errmsg)
                                }
                            },
                            error: (xhr, status) => {
                                commonPage.loadPageStatus('loadSuccess')
                                widget.toast('服务器异常')
                            },
                            noNetwork: () => {
                                commonPage.loadPageStatus('loadSuccess')
                                widget.toast('网络连接失败，请检查网络')
                            }
                        })
                    }
                    this.getData()
                }

            },
            //添加人员
            toAddMember() {
                //埋点
                let statisticsLog_data = {
                    event_id: '组织构架-添加人员',
                    // event_label: data.event_label,(预留，现在不用传此参数)
                    event_param: {
                        ca_from: 'addmember',
                    }
                }
                // alert(JSON.stringify(statisticsLog_data))
                KCApiApp.statisticsLog(statisticsLog_data)

                let encodeStr = encodeURIComponent(`teamId=${this.teamid}&groupName=${this.groupName}&department_id=${this.teamListObj.department_id}`)
                location.href = `dmsaas://AddMember?urdData=${encodeStr}`
            }, 
            //添加部门
            toAddGroup (){
                //埋点
                let statisticsLog_data = {
                    event_id: '组织构架-添加部门',
                    // event_label: data.event_label,(预留，现在不用传此参数)
                    event_param: {
                        ca_from: 'adddepartment',
                    }
                }
                // alert(JSON.stringify(statisticsLog_data))
                KCApiApp.statisticsLog(statisticsLog_data)

                let url = `teamId=${this.teamid}&department_id=${this.teamListObj.department_id}`
                window.location.href="dmsaas://TeamAddDepartment?urdData="+encodeURIComponent(url)
            },  
            //前往成员信息
            gotoUserInfo (user_id,team_id,name,mobile,role_name,roleid){
                //埋点
                let statisticsLog_data = {
                    event_id: '组织构架-成员',
                    // event_label: data.event_label,(预留，现在不用传此参数)
                    event_param: {
                        ca_from: 'member',
                    }
                }
                // alert(JSON.stringify(statisticsLog_data))
                KCApiApp.statisticsLog(statisticsLog_data)

                let str = `teamId=${this.teamid}&user_id=${user_id}&department_id=${this.teamListObj.department_id}&name=${name}&currRole=${this.currRole}&role=${role_name}&mobile=${mobile}&currentLoginUserId=${this.user_id}&roleid=${roleid}`
                console.log(str)
                let encodeStr = encodeURIComponent(str)
                // console.log(encodeStr)
                location.href = `dmsaas://MemberInfo?urdData=${encodeStr}`
            },
            // 前往下级部门
            gotoTeamGroupInfo (id,teamid,parentid,gname){
                let str = `teamId=${teamid}&parent_id=${parentid}&gname=${gname}&id=${id}&user_id=${this.user_id}&webViewId=${this.webViewId}`
                let encodeStr = encodeURIComponent(str)
                location.href = `dmsaas://TeamGroupInfo?urdData=${encodeStr}`
            },
            /*获取列表数据*/
            getData (){
                commonPage.loadPageStatus('loading')
                 util.ajax({
                    url:'/team/department_organ',
                    type:'GET',
                    data:{
                        team_id:this.teamid,
                        department_id:1,  // 顶级部门传1
                        department_only:0
                    },
                    timeout:10000,
                    success:(obj) => {
                        commonPage.loadPageStatus('loadSuccess')
                        if(obj&&obj.errno == 0){
                            this.teamListObj.department_id = obj.data.department_id
                            this.teamListObj.sub_department = obj.data.sub_department
                            this.teamListObj.department_user = obj.data.department_user
                            this.teamListObj.department_user.forEach((item)=>{
                                if(this.user_id == item.user_id){
                                    this.currRole = item.role_name
                                }
                            })
                        }else{
                            widget.toast(obj.errmsg)
                        }
                    },
                    error: (xhr, status) => {
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('服务器异常')
                    },
                    noNetwork: () => {
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('网络连接失败，请检查网络')
                    }
                })
            },
            //权限获取
            getPermissions(){
                commonPage.loadPageStatus('loading')
                util.ajax({
                    url:'/permission/application',
                    type:'GET',
                    data:{
                        team_id:this.teamid,
                        project_id:0,
                        application_id:0
                    },
                    timeout:10000,
                    success:(obj) => {
                        // console.log(JSON.stringify(obj))
                        commonPage.loadPageStatus('loadSuccess')
                        if(obj&&obj.errno == 0){
                            obj.data.forEach ( (i) => {
                                if(i.id_name == 'admin_add_member'){ 
                                    console.log(i.id_name) 
                                    this.admins.add_member = true;
                                    console.log(this.admins.add_member)
                                }
                            })
                        }else{
                            widget.toast(obj.errmsg)
                        }
                    },
                    error: (xhr, status) => {
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('服务器异常')
                    },
                    noNetwork: () => {
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('网络连接失败，请检查网络')
                    }
                })
            },
            // 成员搜索 
            toSearch() {
                let url = `tid=${this.teamid}&pid=${0}&uid=${this.user_id}&originpage=teamgrouplist&department_id=${this.teamListObj.department_id}`
                location.href="dmsaas://ProjectSearchMember?urdData="+encodeURIComponent(url)
            }       
            
        },
        created(){
            this.teamid = util.getUrddataString('teamId')
            this.groupName = util.getUrddataString('groupName')
            this.user_id = util.getUrddataString('user_id')
            console.log(this.user_id)
            this.init();
            commonPage.getWebViewID((data)=>{
                this.webViewId = data
                cache.setMemoryCache('teamGroupListWebViewID',{'webViewID':data})
            })
        },
        ready(){
            /*设置Native的头部*/
            // commonPage.updateTitleBar({
            //     backAction: 'goBack',
            //     leftAction: 'goBack',   // 点击左按钮的动作（即回调函数名称）
            // })
            // window.goBack = () => {
            //     let isAdmins = ''
            //     if(this.admins.add_member == false){
            //         isAdmins = 0
            //     }else{
            //         isAdmins = 1
            //     }
            //     // commonPage.goBack(1,{'key':'user_id','value':this.user_id,'isAdmins':isAdmins})
            // }

            window.getCurrRole = (role) => {
                role = this.currRole
            }
        }

    }


</script>

<!-- CSS 样式 -->
<style src="../../node_modules/weui/dist/style/weui.css"></style>
<style src="../../static/css/common.css"></style>
<style src="../../static/css/user-list.css"></style>